import React from 'react'
import Component, { mapStateToProps, mapDispatchToProps } from '@components/Component'
import { connect } from 'react-redux'
import { updateUncompleteMessage } from '@redux/actions'
import style from './Index.module.less'
import { message } from 'antd'

class Main extends Component {
  state = {
    list: []
  }

  initList () {
    const l = []
    this.props.data.forEach(li => {
      if (li.value) {
        l.push(li)
      }
    })
    this.setState({
      list: l
    })
  }

  readFile (id) {
    if (!id) {
      return message.warning('文书未生成完成')
    }
    this.$readerFileById(id, this.props.caseid)
  }

  componentDidUpdate (prev) {
    if (prev.data !== this.props.data) {
      this.initList()
    }
  }

  componentDidMount () {
    this.$getFileList(this.props.caseid)
    this.initList()
  }

  render () {
    return (
      <div>
        <div className={style['title-line']}>
          <span>文书列表</span>
        </div>
        <div className={style.vars}>
          {this.state.list.map((li, i) => {
            return (
              <span className={style.file} key={i}>
                <span>{i + 1}、</span>
                <a className={style.link} onClick={() => this.readFile(li.value)}>{li.title}</a>
              </span>
            )
          })}
        </div>
      </div>
    )
  }
}

const mapState = mapStateToProps(function (state) {
  return {
    userInfo: state.basic.userInfo
  }
})

const mapDispatch = mapDispatchToProps(function (dispatch) {
  return {
    updateUncompleteMessage: () => dispatch(updateUncompleteMessage(dispatch))
  }
})

export default connect(mapState, mapDispatch)(Main)
